<template>
  <d2-container>
    <template slot="header">
      <el-alert
        class="header_alert"
        title="企业流向查询"
        type="success"
        center
        show-icon>
      </el-alert>
      <el-form :inline="true" :model="ruleForm" :rules="rules" ref="ruleForm" label-width="auto">
        <el-form-item label="商品信息" prop="goodsquerydoc">
          <el-input v-model="ruleForm.goodsquerydoc" placeholder="请输入名称、编号、条形码"></el-input>
        </el-form-item>
        <el-form-item label="库房名称" prop="whcode">
            <el-select v-model="storehouseptions_value" @visible-change="visible_change" @change="options_change">
                <el-option
                    v-for="item in storehouse_options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
            </el-select>
        </el-form-item>
        <el-form-item label="库存是否为零" prop="placenum">
          <el-select v-model="kucunoptions_value" disabled placeholder="库存是否为零" >
                <el-option
                    v-for="item in kucunoptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
            </el-select>
        </el-form-item>
        <el-button type="primary" @click="queryclick('ruleForm')" icon="el-icon-search" :loading="isloading">查询</el-button>
      </el-form>
    </template>
    <el-container >
        <el-main class="first-container">
            <el-table ref="tableData" :data="tableData" height="550" stripe border :key="tableDatakey"
                :row-class-name="tableRowClassName" 
                :header-cell-style="{background:'#eef1f6',color:'#606266'}">
                <el-table-column type="index" :index="indexMethod"></el-table-column>
                <el-table-column prop="OrgName" label="企业名称">
                </el-table-column>
                <el-table-column prop="GoodsCode" label="商品编号">
                </el-table-column>
                <el-table-column prop="barcode" label="商品条形码">
                </el-table-column>
                <el-table-column prop="GoodsName" label="商品名称">
                </el-table-column>
                <el-table-column prop="GoodsSpec" label="商品规格">
                </el-table-column>
                <el-table-column prop="Manufacturer" label="商品产地">
                </el-table-column>
                <el-table-column prop="unit" label="单位">
                </el-table-column>
                <el-table-column prop="WHName" label="货位名称">
                </el-table-column>
                <el-table-column prop="PlaceNum" label="库存数量">
                </el-table-column>
                <el-table-column prop="wzxNum" label="未执行数量">
                </el-table-column>
                <el-table-column prop="occupnum" label="停售数量">
                </el-table-column>
                <el-table-column prop="BatchCode" label="批号">
                </el-table-column>
                <el-table-column prop="ValDate" label="有效期">
                </el-table-column>
                <el-table-column prop="RetailP" label="零售价">
                </el-table-column>
                <el-table-column prop="PurTaxP" label="含税进价">
                </el-table-column>
                <el-table-column prop="mll" label="毛利率">
                </el-table-column>
                <el-table-column prop="BusinessName" label="采购单位">
                </el-table-column>
            </el-table>
        </el-main>
    </el-container>
  </d2-container>
</template>>
<style lang="scss" scoped>
// .box-card{
//   margin-bottom: 10px;
// }
.header_alert{
  margin-bottom: 10px;
}
// .el-table .warning-row {
//     background: red;
//   }

//   .el-table .success-row {
//     background: #f0f9eb;
//   }
// .btn {
//   margin-bottom: 5px;
// }

// .wenzj {
//   font-size: 150%;
// }

// .grid-content {
//   position: relative;
//   top: 10px;
// }

// .grid-content-bg-purple-light {
//   position: relative;
//   top: 10px;
//   left: 30px;
// }

// .main {
//   box-shadow: 0 10px 10px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
// }

.first-container {
  height: 100%;
}
// .container{
//   width: 100%;
//   // padding: 1px;
//   height: 500px;
//   // margin-top: 30px;
// }

// .el-container.is-vertical {
//   height: 800px;
// }

// .secondheard {
//   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
// }

// .queryinput {
//   width: 150px;
//   margin: 5px;
//   padding: 5px;
// }

// .businessname {
//   width: 250px;
//   margin: 5px;
//   padding: 5px;
// }

// .crud-div {
//   position: relative;
//   top: 180px;
//   padding: 0;
// }

// .crud {
//   padding: 0px;
// }

// .d2-crud-body {
//   padding: 1px;
// }

// .el-main {
//   padding: 1px;
// }
</style>

<script>
import { mapActions } from 'vuex'
import util from '@/libs/util.js'
export default {
  data () {
    return {
      isloading: false,
      // 表格数据
      tableData: [],
      // 表格数据备份，用于页面筛选数据使用
      tableDatabak: [],
      // 表格的key，用于强制刷新表格数据
      tableDatakey: 0,
      // 流向查询页面的表格数据
    //   dialogtable: [],
      // 点击查看流向按钮之后保存当前点击行的com_id
    //   dialocomid:'',
    //   dialogdatacount: {},
      // 是否查询零库存选择器，0代表库存不为零，1代表库存为零
      kucunoptions: [{
        value:0,
        label:'库存不为零'
      },{
        value:1,
        label:'库存为零'
      }
      ],
      kucunoptions_value: '库存不为零',
      // 库存名称选择器
      storehouse_options: [{
        value:'',
        label:'全部库房'
        }
      ],
      storehouseptions_value: '',
      pageSize: 100, // 每页多少数据
      currentPage: 1, // 默认当前页为第一页
      // 日期选择器
      // pickerOptions: {
      //   disabledDate (time) {
      //     return time.getTime() > Date.now()
      //   },
      //   shortcuts: [
      //     {
      //       text: '今天',
      //       onClick (picker) {
      //         picker.$emit('pick', new Date())
      //       }
      //     },
      //     {
      //       text: '昨天',
      //       onClick (picker) {
      //         const date = new Date()
      //         date.setTime(date.getTime() - 3600 * 1000 * 24)
      //         picker.$emit('pick', date)
      //       }
      //     },
      //     {
      //       text: '一周前',
      //       onClick (picker) {
      //         const date = new Date()
      //         date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
      //         picker.$emit('pick', date)
      //       }
      //     }]
      // },
      // form表单数据
      ruleForm: {
        goodsquerydoc: '',
        whcode: '',
        placenum: 0
      },
      // 表单验证
      rules: {
        goodsquerydoc: [
          { required: true, type: 'string', message: '请输入需要查询的内容', trigger: 'change' }
        ]
      },
    //   updatepriceform: {
    //     com_id: '',
    //     goodsid: '',
    //     goodsname: '',
    //     angleid: '',
    //     batchcode: '',
    //     taxpriceA: 0
    //   },
    //   updatepriceformLabelWidth: '120px',
    //   liuxiangdialogVisible: false,
    //   updatepricedialogVisible: false,
      // 用于存储表格中所有的商品名称，通过set集合去除重复值
    //   set_goodsname: new Set(),
      // 用于存储表格中所有的商品产地，通过set集合去除重复值
    //   set_Manufacturer: new Set(),
      // 用于存储表格中所有的商品规格，通过set集合去除重复值
    //   set_GoodsSpec: new Set(),
      // 用于存储表格中所有的企业名称，通过set集合去除重复值
    //   set_comname: new Set(),
      // 用于多选框的for循环数据，显示所有的商品名称
    //   filter_goodsname: [],
      // 用于多选框的for循环数据，显示所有的商品产地
    //   filter_Manufacturer: [],
      // 用于多选框的for循环数据，显示所有的商品规格
    //   filter_GoodsSpec: [],
      // 用于多选框的for循环数据，显示所有的企业名称
    //   filter_comname: [],
      // 过滤条件时存储的临时表，存储商品产地
    //   tempcheckbox_Manufacturer_set: new Set(),
      // 过滤条件时存储的临时表，存储商品名称
    //   tempcheckbox_goodsname_set: new Set(),
      // 过滤条件时存储的临时表，存储商品规格
    //   tempcheckbox_GoodsSpec_set: new Set(),
      // 过滤条件时存储的临时表，存储企业名称
    //   tempcheckbox_comname_set: new Set()
    }
  },
  mounted () {
    // this.queryclick()
  },
  methods: {
    ...mapActions('erp/skv11_retail_desk_stockjiecun', [
      'retail_stockjiecun_select','retail_storehouse_select']),
    // handlePageChange (val) {
    //   this.currentPage = val
    //   console.log(this.currentPage)
    //   this.queryclick()
    // },
    // handlePageSizeChange (val) {
    //   this.pageSize = val
    //   console.log(this.pageSize)
    // },
    /**
     * 多选框change事件
     * 入参：filter_name_string：多选框类型名称 （filter_goodsname、filter_Manufacturer。filter_GoodsSpec、filter_comname）
     *       checkbox_index_val：选中时的index索引值
    */
    // checkbox_goodsname_change (filter_name_string,checkbox_index_val){
    //   // 先将表格原数据恢复，防止之前的过滤状态还存在
    //   this.tableData = this.tableDatabak
    //   // 定义几个过滤器的状态，初始值为false
    //   var is_filter_goodsname = false
    //   var is_filter_Manufacturer = false
    //   var is_filter_GoodsSpec = false
    //   var is_filter_comname = false
    //   // 判断多选框类型名称，做相应的处理
    //   if (filter_name_string === 'filter_goodsname') {
    //     // 判断过滤条件时存储的临时表tempcheckbox_goodsname_set中是否已经有索引
    //     if (this.tempcheckbox_goodsname_set.has(checkbox_index_val)) {
    //       // 有索引则删除索引,用于清除之前的过滤条件
    //       this.tempcheckbox_goodsname_set.delete(checkbox_index_val)
    //     }
    //     else{
    //       // 没有索引则新增索引,用于增加过滤条件
    //       this.tempcheckbox_goodsname_set.add(checkbox_index_val)
    //     }
    //     // 设置过滤器的状态为true
    //     is_filter_goodsname = true
    //   }
    //   if (filter_name_string === 'filter_Manufacturer') {
    //     if (this.tempcheckbox_Manufacturer_set.has(checkbox_index_val)) {
    //       this.tempcheckbox_Manufacturer_set.delete(checkbox_index_val)
    //     }
    //     else{
    //       this.tempcheckbox_Manufacturer_set.add(checkbox_index_val)
    //     }
    //     is_filter_Manufacturer = true
    //   }
    //   if (filter_name_string === 'filter_GoodsSpec') {
    //     if (this.tempcheckbox_GoodsSpec_set.has(checkbox_index_val)) {
    //       this.tempcheckbox_GoodsSpec_set.delete(checkbox_index_val)
    //     }
    //     else{
    //       this.tempcheckbox_GoodsSpec_set.add(checkbox_index_val)
    //     }
    //     is_filter_GoodsSpec = true
    //   }
    //   if (filter_name_string === 'filter_comname') {
    //     if (this.tempcheckbox_comname_set.has(checkbox_index_val)) {
    //       this.tempcheckbox_comname_set.delete(checkbox_index_val)
    //     }
    //     else{
    //       this.tempcheckbox_comname_set.add(checkbox_index_val)
    //     }
    //     is_filter_comname = true
    //   }
    //   // 定义一个临时变量 temptabledata
    //   var temptabledata = []
    //   // 判断过滤器的状态是否为true
    //   if (is_filter_goodsname) {
    //     // 循环表格
    //     this.tableData.map((val,index,arry)=>{
    //       // 循环表格时匹配过滤条件临时表中的商品名称是否与表格中一致,如果一致则添加到新的表格临时表中temptabledata
    //       this.tempcheckbox_goodsname_set.forEach((tempcheckbox_val_set_val)=>{
    //           if (val.GoodsName === this.filter_goodsname[tempcheckbox_val_set_val]) {
    //             temptabledata.push(val)
    //         }
    //       })
    //     })
    //   }
    //   if (is_filter_Manufacturer) {
    //     this.tableData.map((val,index,arry)=>{
    //       this.tempcheckbox_Manufacturer_set.forEach((tempcheckbox_val_set_val)=>{
    //           if (val.Manufacturer === this.filter_Manufacturer[tempcheckbox_val_set_val]) {
    //             temptabledata.push(val)
    //         }
    //       })
    //     })
    //   }
    //   if (is_filter_GoodsSpec) {
    //     this.tableData.map((val,index,arry)=>{
    //       this.tempcheckbox_GoodsSpec_set.forEach((tempcheckbox_val_set_val)=>{
    //           if (val.GoodsSpec === this.filter_GoodsSpec[tempcheckbox_val_set_val]) {
    //             temptabledata.push(val)
    //         }
    //       })
    //     })
    //   }
    //   if (is_filter_comname) {
    //     this.tableData.map((val,index,arry)=>{
    //       this.tempcheckbox_comname_set.forEach((tempcheckbox_val_set_val)=>{
    //           if (val.COM_NAME === this.filter_comname[tempcheckbox_val_set_val]) {
    //             temptabledata.push(val)
    //         }
    //       })
    //     })
    //   }
    //   // 判断是过滤条件临时表中是否全部清空,如果全部清空,则还原表格数据
    //   if (
    //     this.tempcheckbox_Manufacturer_set.size === 0 && 
    //     this.tempcheckbox_goodsname_set.size === 0 && 
    //     this.tempcheckbox_GoodsSpec_set.size === 0 && 
    //     this.tempcheckbox_comname_set.size === 0 
    //   ){
    //     this.tableData = this.tableDatabak
    //     // 将tableDatakey，用于主动刷新表格DOM
    //     this.tableDatakey++
    //     return
    //   }
    //   // 将过滤过的临时表数据赋值给tableData，用于刷新表格数据
    //   this.tableData = temptabledata
    //   // 将tableDatakey，用于主动刷新表格DOM
    //   this.tableDatakey++
    // },
    /**
     * 流向查询弹窗关闭事件
    */
    // liuxiangdialogclose (){
    //   this.dialogtable = []
    //   this.dialogdatacount = {}
    //   this.liuxiangdialogVisible = false
    //   this.dialocomid = ''
    // },
    /**
     * 调价弹窗关闭事件
    */
    // updatepricedialogclose (){
    //   this.updatepriceform = {
    //     com_id: '',
    //     goodsid: '',
    //     goodsname: '',
    //     angleid: '',
    //     batchcode: '',
    //     taxpriceA: 0
    //   }
    //   this.updatepricedialogVisible = false
    // },
    /**
     * 设置调价弹窗的form内容
    */
    // set_updatepriceform (com_id_qrue,goodsid_qrue,goodsname_qrue,angleid_qrue,batchcode_qrue,SaleTaxP_qrue){
    //   this.updatepriceform.com_id = com_id_qrue
    //   this.updatepriceform.goodsid = goodsid_qrue
    //   this.updatepriceform.goodsname = goodsname_qrue
    //   this.updatepriceform.angleid = angleid_qrue
    //   this.updatepriceform.batchcode = batchcode_qrue
    //   this.updatepriceform.taxpriceA = SaleTaxP_qrue
    //   this.updatepricedialogVisible = true
    // },
    /**
     * 查询商品流向
    */
    // search_liuxiang (com_id_qrue,goodsid_qrue) {
    //   // this.liuxiangdialogVisible = true
    //   this.collect_data_analysis_directionqrue({
    //     entid:util.cookies.get('entid'),
    //     com_id:com_id_qrue,
    //     goodsid:goodsid_qrue
    //   }).then((val)=>{
    //     if (val) {
    //       this.dialogtable = val.data
    //       this.dialogdatacount = val.pages
    //       this.dialocomid = com_id_qrue
    //       this.liuxiangdialogVisible = true
    //       // console.log(this.dialogtable[0].com_id)
    //     }
    //   })
    //   // this.$message.error('流向查询功能正在开发中。。。')
    // },
    /**
     * 查询商品流向,根据summaries流向摘要查询
    */
    // search_liuxiang_summaries (com_id_qrue,goodsid_qrue,summaries_qrue) {
    //   // this.liuxiangdialogVisible = true
    //   this.dialogtable = []
    //   this.dialogdatacount = {}
    //   this.collect_data_analysis_directionqrue({
    //     entid:util.cookies.get('entid'),
    //     com_id:com_id_qrue,
    //     goodsid:goodsid_qrue,
    //     summaries:summaries_qrue
    //   }).then((val)=>{
    //     if (val) {
    //       this.dialogtable = val.data
    //       this.dialogdatacount = val.pages
    //       // this.liuxiangdialogVisible = true
    //     }
    //   })
    //   // this.$message.error('流向查询功能正在开发中。。。')
    // },
    /**
     * 调价功能
    */
    // tiaojia (com_id_qrue,goodsid_qrue,angleid_qrue,SaleTaxP_qrue) {
    //   this.collect_data_analysis_updateprice({
    //     entid:util.cookies.get('entid'),
    //     com_id:com_id_qrue,
    //     goodsid:goodsid_qrue,
    //     AngleId:angleid_qrue,
    //     TaxpriceA:SaleTaxP_qrue
    //   }).then((val)=>{
    //     if (val) {
    //       this.$message.success(val.msg)
    //     }
    //   })
    //   this.updatepricedialogclose()
    //   this.queryclick()
    //   // this.$message.error('调价功能正在开发中。。。')
    // },
    /**
     * 获取当前时间
     * 格式YYYY-MM-DD
    */
    getNowFormatDate (date) {
      var seperator1 = '-'
      var year = date.getFullYear()
      var month = date.getMonth() + 1
      var strDate = date.getDate()
      if (month >= 1 && month <= 9) {
        month = '0' + month
      }
      if (strDate >= 0 && strDate <= 9) {
        strDate = '0' + strDate
      }
      var currentdate = year + seperator1 + month + seperator1 + strDate
      return currentdate
    },
    /**
     * 页面heard上的查询按钮点击事件,做了一个时间转换
    */
    queryclick () {
      this.isloading = true
      this.tableData = []
      // 将所有的临时数据以及过滤条件全部重置
    //   this.tempcheckbox_goodsname_set.clear()
    //   this.tempcheckbox_Manufacturer_set.clear()
    //   this.set_goodsname.clear()
    //   this.set_GoodsSpec.clear()
    //   this.set_Manufacturer.clear()
    //   this.set_comname.clear()
    //   this.filter_goodsname = []
    //   this.filter_GoodsSpec = []
    //   this.filter_Manufacturer = []
    //   this.filter_comname = []
      // 调用接口，获取数据
      this.retail_stockjiecun_select({
        EntId: util.cookies.get('entid'),
        OrgId: util.cookies.get('OrgId'),
        goods_query: this.ruleForm.goodsquerydoc,
        whcode: this.storehouseptions_value
      }).then((data) => {
        if (data) {
          this.tableData = data.data
          // 备份表格数据
        //   this.tableDatabak = data.data
          // 循环表格数据，将表格相关的数据写到相对应的set集合中
        //   this.tableData.map((val,index,arry)=>{
        //     this.set_goodsname.add(val.GoodsName)
        //     this.set_GoodsSpec.add(val.GoodsSpec)
        //     this.set_Manufacturer.add(val.Manufacturer)
        //     this.set_comname.add(val.COM_NAME)
        //   })
          // 将set集合转成list，用于渲染页面多选框数据
        //   this.filter_goodsname = Array.from(this.set_goodsname).sort()
        //   this.filter_goodsname = Array.from(this.set_goodsname).sort()
        //   this.filter_GoodsSpec = Array.from(this.set_GoodsSpec).sort()
        //   this.filter_Manufacturer = Array.from(this.set_Manufacturer).sort()
        //   this.filter_comname = Array.from(this.set_comname).sort()
        }
        else{
            this.tableData = []
            this.isloading = false
        }
        this.isloading = false
      })
    },
    /**
     * 库存名称选择器下拉框事件
    */
    visible_change(ischange){
        // console.log(ischange);
        this.storehouse_options=[]
        if (ischange) {
            this.retail_storehouse_select({
                EntId: util.cookies.get('entid'),
                orgid: util.cookies.get('OrgId'),
                whtype: ''
            }).then((data)=>{
                if (data) {
                    // console.log(data.data);
                    data.data.map((val,index,arry)=>{
                        // console.log(val);
                        this.storehouse_options.push(
                            {value:val.whcode,label:val.whname}
                        )
                    })
                    this.storehouse_options.push(
                        {value:'',label:'全部库房'}
                    )
                    // console.log(this.storehouse_options);
                }
            })
        }
    },
    /**
     * 库存名称选择器change事件
    */
    options_change(val){
        this.storehouseptions_value=val
    },
    // 单元格选中数据回调
    // selection (selection, row) {
    //   this.select_change_val = selection
    // },
    // 单元格全选数据回调
    // selectall (selection) {
    //   this.select_change_val = selection
    // },
    // 点击翻页时触发
    // changePageNum: function(val) {
    //   this.currentPage = val;
    //   console.log(this.currentPage)
    //   this.queryclick();
    // },
    indexMethod(index) {
      return index + 1
    },
    // 页面heard上的重置条件按钮的点击事件
    resetForm (formName) {
      this.$refs[formName].resetFields()
    },
    tableRowClassName({row, rowIndex}) {
        if (rowIndex === 1) {
          return 'warning-row';
        } else if (rowIndex === 3) {
          return 'success-row';
        }
        return '';
      }
  }
}
</script>
